/**
 * Name：layui修改模块
 * Author：Created by RisingSun.
 * Date: 20231010
 * Time: 11:05 
 */


layui.define(function(exports){
  
  /*
    下面通过 layui.use 分段加载不同的模块，实现不同区域的同时渲染，从而保证视图的快速呈现
  */
  let lang={};
  $.ajax({
        url: layui.setter.url.lang,
        async:false,
        type: 'post',
        dataType: "json",
        success:function(R){
            if (R.code == 200) {
                lang=R.lang;
            } else {
                console.log('data is null');
            }
        },
        error: function (R) {
            console.log('failure to send to database');
        }
    });
  
  //区块轮播切换
  layui.use(['admin', 'carousel'], function(){
    var $ = layui.$
    ,admin = layui.admin
    ,carousel = layui.carousel
    ,element = layui.element
    ,device = layui.device();

    //轮播切换
    $('.layadmin-carousel').each(function(){
      var othis = $(this);
      carousel.render({
        elem: this
        ,width: '100%'
        ,arrow: 'none'
        ,interval: othis.data('interval')
        ,autoplay: othis.data('autoplay') === true
        ,trigger: (device.ios || device.android) ? 'click' : 'hover'
        ,anim: othis.data('anim')
      });
    });
    
    element.render('progress');
    
  });

  //数据概览
  layui.use(['carousel', 'echarts'], function(){
    var $ = layui.$
    ,carousel = layui.carousel
    ,echarts = layui.echarts
    ,online = []
    ,ondevice = []
    ,newuser = [];
    //用户登录图表
    $.ajax({
        url: layui.setter.url.online,
        async:false,
        type: 'post',
        dataType: "json",
        success:function(R){
            //初始化值
            online['xdata']='';
            online['datalist']=[];
            if (R.code == 200) {
                online['xdata']=R.time;
                online['datalist']=[];
                (R.datalist).forEach( function(item){
                    online['datalist'].push({
                        name:lang.nonline,
                        type:'line',
                        smooth:true,
                        itemStyle: {normal: {areaStyle: {type: 'default'}}},
                        data: item
                    });
                })
            } else {
                console.log('data is null');
            }
        },
        error: function (R) {
            console.log('failure to send to database');
        }
    });

    //登录设备图表
    $.ajax({
        url: layui.setter.url.ondevice,
        async:false,
        type: 'post',
        dataType: "json",
        success:function(R){
            //初始化值
            ondevice['device']='';
            ondevice['datalist']=[];
            if (R.code == 200) {
                ondevice['device']=R.device;
                ondevice['datalist']=R.datalist;
            } else {
                console.log('data is null');
            }
        },
        error: function (R) {
            console.log('failure to send to database');
        }
    });

    //最近一周新增用户
    $.ajax({
        url: layui.setter.url.newuser,
        async:false,
        type: 'post',
        dataType: "json",
        success:function(R){
            //初始化值
            newuser['time']='';
            newuser['datalist']=[];
            if (R.code == 200) {
                newuser['time']=R.time;
                newuser['datalist']=R.datalist;
            } else {
                console.log('data is null');
            }
        },
        error: function (R) {
            console.log('failure to send to database');
        }
    });
    
    var echartsApp = [], options = [
      //今日流量趋势
      {
        title: {
          text: lang.uonline,
          x: 'center',
          textStyle: {
            fontSize: 14
          }
        },
        tooltip : {
          trigger: 'axis',
          // formatter: "{b}<br>新增预警用户：{c}"
        },
        legend: {
          data:['','']
        },
        xAxis : [{
          type : 'category',
          boundaryGap : false,
          data: online['xdata']
        }],
        yAxis : [{
          type : 'value'
        }],
        series : online['datalist']
      },
      
      //用户设备分布
      { 
        title : {
          text: lang.udevice,
          x: 'center',
          textStyle: {
            fontSize: 14
          }
        },
        tooltip : {
          trigger: 'item',
          formatter: "{a} <br/>{b} : {c} ({d}%)"
        },
        legend: {
          orient : 'vertical',
          x : 'left',
          data:ondevice['device']
        },
        series : [{
          name:ondevice['title'],
          type:'pie',
          radius : '55%',
          center: ['50%', '50%'],
          data:ondevice['datalist']
        }]
      },
      
      //新增的用户量
      {
        title: {
          text: newuser['title'],
          x: 'center',
          textStyle: {
            fontSize: 14
          }
        },
        tooltip : { //提示框
          trigger: 'axis',
          formatter: "{b}<br>"+lang.usonline+"：{c}"
        },
        xAxis : [{ //X轴
          type : 'category',
          data : newuser['time']
        }],
        yAxis : [{  //Y轴
          type : 'value'
        }],
        series : [{ //内容
          type: 'line',
          data:newuser['datalist'],
        }]
      }
    ]
    ,elemDataView = $('#LAY-index-dataview').children('div')
    ,renderDataView = function(index){
      echartsApp[index] = echarts.init(elemDataView[index], layui.echartsTheme);
      echartsApp[index].setOption(options[index]);
      window.onresize = echartsApp[index].resize;
    };
    
    
    //没找到DOM，终止执行
    if(!elemDataView[0]) return;
    
    
    
    renderDataView(0);
    
    //监听数据概览轮播
    var carouselIndex = 0;
    carousel.on('change(LAY-index-dataview)', function(obj){
      renderDataView(carouselIndex = obj.index);
    });
    
  });

  //在线用户
  layui.use('table', function(){
    var $ = layui.$
    ,table = layui.table;

    //今日热搜
    table.render({
      elem: '#LAY-index-topSearch'
      ,url: layui.setter.url.useronline //接口
      ,method: 'post'
      ,even: true
      ,page: true
      ,limit: 3
      ,cols: [[
         {type: 'numbers', title: function(){ return lang.serial } }
        ,{field: 'username', title: function(){ return lang.account }, minWidth: 70}
        ,{field: 'realname', title: function(){ return lang.name } }
        ,{field: 'mobile', title: function(){ return lang.phone } }
        ,{field: 'time', title: function(){ return lang.logintime }, sort: true,minWidth:200}
        ,{field: 'ip', title: function(){ return lang.logip } }
        ,{field: 'roletype', title: function(){ return lang.role } }
        ,{field: '', title: function(){ return lang.operation }, templet: '<div><a class="layui-btn layui-btn-danger layui-btn-xs" href="#" onclick="xadmin.post({url:\'\/admin\/index\/offline\',data:{ id:{{ d.id }} } })"><i class="layui-icon layui-icon-delete"></i>'+lang.forced+'</a></div>'}
      ]],
      done: function(d) {
          layer.closeAll('loading');
      }
    });
    
    //今日热贴
    table.render({
      elem: '#LAY-index-topCard'
      ,url: layui.setter.url.recordlogin //接口
      ,method: 'post'
      ,page: true
      // ,cellMinWidth: 120
      ,limit: 3
      ,cols: [[
         {type: 'numbers', title: function(){ return lang.serial } }
        ,{field: 'aid', title: function(){ return lang.accountid }, width:100, sort: true}
        ,{field: 'username', title: function(){ return lang.account }, width:100, sort: true}
        ,{field: 'ip_address', title: function(){ return lang.logip }, width:150}
        ,{field: 'log_time', title: function(){ return lang.logintime }, sort: true}
        ,{field: 'log_info', title: function(){ return lang.back } }
        ,{field: 'roletype', title: function(){ return lang.accclass }, width:150}
        ,{field: 'equipment', title: function(){ return lang.device }, width:150}
      ]]
      // ,skin: 'line'
    });
  });
  
  exports('console', {})
});